﻿var cube1;
var cube2;
var cube3;
var host = 'shaizi.cnodejs.net';
var port = 8080;
var socketurl = 'ws://' + host + ':' + port + '/';
var w;
var LogedIn = false;
var allowVote = false;
$(document).ready(function() {
    cube1 = new cube("#cube1");
    cube2 = new cube("#cube2");
    cube3 = new cube("#cube3");
    cube1.rotate(45, 45, 0);
    cube2.rotate(135, 45, 0);
    cube3.rotate(45, 135, 0);
    createSocket(socketurl);
    $("#logIn #logInButton").live("click",function(){
        $("#logIn #form #logInError").remove();
        var name = $("#logIn #logInUserName").val();
        if(name != ""){
            if(w.opened){
                w.send("{'type':4,'name':'"+name+"'}");
            }
        }else{
           $("#logIn #form").append("<p id='logInError'>请输入用户名</p>");
        }
        return false;
    });
});
function createSocket(url) {
    w = new WebSocket(url);
    w.onmessage = function(data) {
        //alert(data.data);
           //alert(data.data);
            var obj = $.parseJSON((data.data));
          //  alert(obj.type);
            switch (parseInt(obj.type)) {
                case 4:
                    if(obj.isExist){
                        $("#logIn #form").append("<p id='logInError'>用户名重复，请使用其他用户名</p>");
                    }else{
                        LogedIn = true;
                        $("#main #userInfo #userName").html(obj.name);
                        $("#main #userInfo #moneyRemain").html("$ " + obj.amt);
                        $("#logIn").fadeOut(100,function(){
                            $("#main").show();
                        });
                        buttonsBind(true);
                        cube1.roll();
                        cube2.roll();
                        cube3.roll();
                    }
                    break;
                case 1:
                    finish(obj.draw.split(","));
                    break;
                case 3:
                    appendUsers(obj);
                    break;
                case 2:
                    $("#userInfo #userName").html(obj.name);
                    $("#userInfo #moneyRemain").html("$ " +  obj.amt);
                    break;
                case 5:
                    alert(data.data);
                    var historyList = obj.content;
                    var historyLength = historyList.length;
                    var historyContent = "";
                    var total = 0;
                    var numbers;
                    var content = "";
                    for(var i = 0; i< historyLength;i++){
                        numbers = historyList[i].draw.split(",");
                        if(parseInt(numbers[0]) == parseInt(numbers[1]) == parseInt(numbers[2])){
                            content = "<a class='button orange' id='baozi'>豹</a>";
                        }else{
                            total = parseInt(numbers[0]) + parseInt(numbers[1]) + parseInt(numbers[2]);
                            if(total < 11){
                                content = "<a class='button green' id='small'>小</a>";
                            }else{
                                content = "<a class='button red' id='big'>大</a>";
                            }
                        }
                        historyContent = historyContent + content;
                    }
                    $("#right").html(historyContent);
                    break;
                case 6:
                    var amt = parseInt($("#userInfo #moneyRemain").html());
                    amt = amt + parseInt(obj.addMoney);
                    $("#userInfo #moneyRemain").html(amt);
                    break;
                case 7:
                    countDown(obj.second);
                    break;
                case 8:
                    if(obj.begin){
                        allowVote = true;
                    }else{
                        allowVote = false;
                    }
                    buttonsBind(allowVote);
                    break;
                case 9:
                    break;
                default:
                    alert(data.data);
            }
    }
    w.onopen = function() {
        w.opened = true;
        $("#loading").fadeOut(100,function(){
            $("#logIn").fadeIn(100);
        });
    }
    w.onclose = function() {
        buttonsBind(false);
        cube1.to(1);
        cube2.to(1);
        cube3.to(1);
        w.opened = false;
    }
    w.onerror = function() {
        buttonsBind(false);
        cube1.to(2);
        cube2.to(2);
        cube3.to(2);
        alert("error");
        w.opened = false;
    }
}
function countDown(time){
    allowVote = false;
    buttonsBind(allowVote);
    time = time -1;
    var inter = setInterval(function(){
    if(time > 0){
        $("#loading").html("<div class='show' style='margin-top: 100px;font-size: 20px'>" + time+ "</div>");
        $("#loading").show();
        time--;
    }else{
        $("#loading").hide();
        clearInterval(inter);
    }
    },1000);

}
function appendUsers(obj) {
    var bet;
    switch (parseInt(obj.bet)) {
            case 0:
                bet = "<a id='"+obj.name + "' class='userBet green hidden' style='display:none'>"+ obj.name+ " $" + obj.amt +"</a>";
                break;
            case 1:
                bet = "<a id='"+obj.name + "' class='userBet red hidden' style='display:none'>"+ obj.name+ " $" + obj.amt +"</a>";
                break;
            case 2:
                bet = "<a id='"+obj.name + "' class='userBet orange hidden' style='display:none'>"+ obj.name+ " $" + obj.amt +"</a>";
                break;
            default:
                alert("bet:" + obj.bet);
      }
    //alert(result);
    $("#right").append(bet);
    $("#right .show").fadeOut(100,function(){
        $("#right .show").remove();
        $("#right .hidden").removeClass("hidden").addClass("show").fadeIn(100);
    });
}

function finish(array) {
    var result;
    cube1.to(array[0]);
    cube2.to(array[1]);
    cube3.to(array[2]);
    if (array[0] == array[1] && array[0] == array[2]) {
        result = "baozi";
    } else {
        var total = parseInt(array[0]) + parseInt(array[1]) + parseInt(array[2]);
        if (total < 11) {
            result = "small";
        } else {
            result = "big";
        }
    }
    var amount = $("#money #amount");
    var remain = $("#name #moneyRemain #number");
    var bonus;
    if ($("#bet .selected").attr("id") == result) {
        if (result == "baozi") {
            bonus = parseInt(amount.html()) * 36;       
        } else {
            bonus = parseInt(amount.html()) * 2;
        }
        remain.html(parseInt(remain.html()) + bonus);
    }
    amount.html("0");
    $("#right").html("");
}

function buttonsBind(bool) {
    if (bool) {
        //buttons
      //  $("#bet .button").removeClass("selected").removeClass("unselected");
        $("#bet .button").unbind("click");
        $("#bet .button").bind("click", function() {
            return false;
        });
        $("#bet .button").bind("click", function() {
            $(this).parent().find(".button").addClass("unselected").removeClass("selected");
            $(this).removeClass("unselected").addClass("selected");
            $(this).parent().find(".unselected").hide();
            return false;
        });
        $("#money #add").bind("click", function() {
            var allow = true;
            var remain = $("#name #moneyRemain #number");
            var amount = $(this).parent().find("#amount");
            if (parseInt(remain.html()) - parseInt(amount.html()) < 10) {
                allow = false;
                Shake(remain.parent());
            }
            if (allow) {
                amount.html(parseInt(amount.html()) + 10);
            }
            return false;
        });
        $("#money #minus").bind("click", function() {
            var allow = true;
            var amount = $(this).parent().find("#amount");
            if (parseInt(amount.html()) <= 10) {
                allow = false;
                Shake(amount);
            }
            if (allow) {
                amount.html(parseInt(amount.html()) - 10);
            }
            return false;
        });
        //buttons end
    } else {
        $(".button").unbind("click");
        $(".button").bind("click", function() {
            return false;
        });

    }
}

function cube(thing) {
    var o = this;
    this.cube = $(thing);
    this.x = 0;
    this.y = 0;
    this.z = 0;
    this.rotate = function(x, y, z) {
        o.x = o.x + x;
        o.y = o.y + y;
        o.z = o.z + z;
        //alert("x="+this.x+" y="+this.y);
        o.cube.css("-webkit-transform", "rotateX(" + o.x + "deg) rotateY(" + o.y + "deg) rotateZ(" + o.z + "deg)");
    }
    this.roll = function() {
        if (o.timer == undefined) {
            o.timer = setInterval(function() {
                o.rotate(120, 120, 0);
            }, 300);
        }
    }
    this.to = function(result) {
        o.x = 0;
        o.y = 0;
        o.z = 0;
        result = parseInt(result);
        clearInterval(o.timer);
        o.timer = undefined;
        switch (result) {
            case 1:
                o.rotate(-90, 0, 0);
                break;
            case 2:
                o.rotate(0, 0, 0);
                break;
            case 3:
                o.rotate(0, -90, 0);
                break;
            case 4:
                o.rotate(0, 90, 0);
                break;
            case 5:
                o.rotate(180, 0, 180);
                break;
            case 6:
                o.rotate(-90, 0, 180);
                break;
            default:
                o.roll();
        }
    }
}

function Shake(objs) {
    $(objs).each(function(index, obj) {
        $(obj).animate({marginLeft:"-=2px"}, 20, function() {
            $(obj).animate({marginLeft:"+=5px"}, 20, function() {
                $(obj).animate({marginLeft:"-=5px"}, 20, function() {
                    $(obj).animate({marginLeft:"+=5px"}, 20, function() {
                        $(obj).animate({marginLeft:"-=5px"}, 20, function() {
                            $(obj).animate({marginLeft:"+=2px"}, 20);
                        });
                    });
                });
            });
        });
    });
}